<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8" />
		<title>lightbox</title>
		<link rel="stylesheet" type="text/css" href="css/lightbox.css" />
		<script type="text/javascript" src="js/jquery-1.10.0.js"></script>
		<script type="text/javascript" src="js/rem.js"></script>
		<script type="text/javascript" src="js/lightbox.js"></script>
		<script>
			$(function() {
				var lightbox = new LightBox();
			});
		</script>
	</head>

	<body>
		<h1>1组图片</h1>
		<div>
			<img class="js-lightbox" data-role="lightbox" data-source="images/1-1.jpg" data-group="group-1" data-id="image-1-1" data-caption="fsdfali" src="images/1-1.jpg" width="100" height="100" />
			<img class="js-lightbox" data-role="lightbox" data-source="images/1-2.jpg" data-group="group-1" data-id="image-1-2" data-caption="fsdfrewali" src="images/1-2.jpg" width="100" height="100" />
			<img class="js-lightbox" data-role="lightbox" data-source="images/1-3.jpg" data-group="group-1" data-id="image-1-3" data-caption="fsdgfdfali" src="images/1-3.jpg" width="100" height="100" />
			<img class="js-lightbox" data-role="lightbox" data-source="images/1-4.jpg" data-group="group-1" data-id="image-1-4" data-caption="dgggd" src="images/1-4.jpg" width="100" height="100" />

		</div>
		<h1>2组图片</h1>
		<div>
			<img class="js-lightbox" data-role="lightbox" data-source="images/2-1.jpg" data-group="group-2" data-id="image-2-1" data-caption="fsdfali" src="images/2-1.jpg" width="100" height="100" />
		</div>
	</body>

</html>